<template>

  <splitpanes :horizontal="appStore2.device === 'mobile'" class="default-theme">
    <!--左边数据-->
    <pane size="16" class="min-height">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['scm:scmCustomerOrders:add']">新增</el-button>
        </el-col>
        <right-toolbar :search="false" v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>
      <el-table v-loading="loading" :data="scmCustomerOrdersList"  lazy highlight-current-row @current-change="handleCurrentOrder" >
        <el-table-column label="订单编号" align="left" prop="orderCode" />
        <el-table-column label="" align="center" class-name="small-padding fixed-width" width="20">
          <template #default="scope">
            <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['scm:scmCustomerOrders:remove']"></el-button>
          </template>
        </el-table-column>
      </el-table>
    </pane>
    <pane size="84" style="height: 100%;">
      <el-tabs type="border-card" >
<!--  <el-tabs type="border-card" style="height: 75vh;" >-->
        <el-tab-pane label="订单基础信息" >
          <el-card v-if=!open >
            <h4>提示</h4>
            <ul>
              <li>若添加订单，请先点击 新增 按钮。</li>
              <li>若查看订单，请先点击 订单列表 中订单编号进行查看。</li>
            </ul>
            <el-divider />
          </el-card>
          <el-form ref="scmCustomerOrdersRef" :model="form" :rules="rules" label-width="80px" v-if=open :disabled="orderFormDisabled" >
            <el-row :gutter="20">
              <el-col :span="6">
                <el-form-item label="订单编号" prop="orderCode">
                  <el-input v-model="form.orderCode" placeholder="请输入订单编号" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="订单日期" prop="orderDate">
                  <el-date-picker clearable v-model="form.orderDate" type="date"value-format="YYYY-MM-DD"placeholder="请选择订单日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="订单到货日" prop="requestedDeliveryDate" label-width="90px" >
                  <el-date-picker clearable v-model="form.requestedDeliveryDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择订单到货日">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="订单到货日回复" prop="repliedDeliveryDate" label-width="110px" >
                  <el-date-picker clearable v-model="form.repliedDeliveryDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择到货日回复">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item label="订单状态" prop="paymentStatus">
                  <el-select v-model="form.paymentStatus" placeholder="请选择订单状态">
                    <el-option v-for="dict in scm_payment_status" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="订单金额" prop="totalAmount">
                  <el-input-number v-model="form.totalAmount" placeholder="订单金额" type="number" :min="0" :controls="false" class="number-right" style="width: 100%;" :precision="2" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="已支付金额" prop="receivedAmount" label-width="90px" >
                  <el-input-number v-model="form.receivedAmount" placeholder="已支付金额金额" type="number" :min="0" :controls="false" class="number-right" style="width: 100%;" :precision="2" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="发票金额" prop="invoiceAmount" label-width="90px" >
                  <el-input-number v-model="form.invoiceAmount" placeholder="已支付金额金额" type="number" :min="0" :controls="false" class="number-right" style="width: 100%;" :precision="2" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-divider class="custom-divider">甲方</el-divider>
            <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item label="甲方抬头" prop="buyerTitle">
                  <el-input v-model="form.buyerTitle" placeholder="请输入甲方抬头" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="甲方地址" prop="buyerAddress">
                  <el-input v-model="form.buyerAddress" placeholder="请输入甲方地址" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="签署日期" prop="buyerSignDate">
                  <el-date-picker clearable v-model="form.buyerSignDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择甲方签署日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item label="开户银行" prop="buyerAccountBank">
                  <el-input v-model="form.buyerAccountBank" placeholder="请输入甲方开户银行" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="银行账号" prop="buyerAccountNumber">
                  <el-input v-model="form.buyerAccountNumber" placeholder="请输入甲方银行账号" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="联系人" prop="buyerPerson">
                  <el-input v-model="form.buyerPerson" placeholder="请输入甲方联系人" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="联系电话" prop="buyerPhone">
                  <el-input v-model="form.buyerPhone" placeholder="请输入甲方电话" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>

            </el-row>
            <el-divider class="custom-divider">乙方</el-divider>
            <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item label="乙方抬头" prop="sellerTitle">
                  <el-input v-model="form.sellerTitle" placeholder="请输入乙方抬头" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="乙方地址" prop="sellerAddress">
                  <el-input v-model="form.sellerAddress" placeholder="请输入乙方地址" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="签署日期" prop="sellerSignDate">
                  <el-date-picker clearable v-model="form.sellerSignDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择乙方签署日期">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="6">
                <el-form-item label="开户银行" prop="sellerAccountBank">
                  <el-input v-model="form.sellerAccountBank" placeholder="请输入乙方开户银行" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="银行账号" prop="sellerAccountNumber">
                  <el-input v-model="form.sellerAccountNumber" placeholder="请输入乙方银行账号" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="联系人" prop="sellerPerson">
                  <el-input v-model="form.sellerPerson" placeholder="请输入乙方联系人" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="联系电话" prop="sellerPhone">
                  <el-input v-model="form.sellerPhone" placeholder="请输入乙方电话" />
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <el-form ref="scmCustomerOrdersRef2" :model="form" :rules="rules" label-width="80px" v-if=open >
            <el-divider content-position="center" class="custom-divider">合同信息</el-divider>
            <el-row :gutter="24">
<!--              <el-col :span="8">-->
<!--                <el-form-item label="合同文件" prop="contractFileName">-->
<!--                  <el-input v-model="form.contractFileName" placeholder="请输入合同文件名字" />-->
<!--                </el-form-item>-->
<!--              </el-col>-->
              <el-col :span="12">
                <el-form-item label="合同文件" prop="contractFile">
                  <!--                  <file-upload v-model="form.contractFile"/>-->
                  <div style="display: flex; gap: 10px; align-items: center; width: 100%">
                    <el-input :value="form.contractFile ? form.contractFile.substring(form.contractFile.lastIndexOf('/') + 1) : '' " placeholder="请上传图纸" style="flex: 2;" disabled />
                    <file-upload v-model="form.contractFile" :isShowTip="false" v-if="!orderFormDisabled" />
                    <el-button size="default" type="text" @click="$download.resource(form.contractFile,false)" :disabled="false" native-type="button" formnovalidate>下载</el-button>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="备注" prop="remarks" >
                  <el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" :disabled="orderFormDisabled"/>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div v-if=open style="display: flex; justify-content: space-between; margin-top: 1px;">
            <div>
              <el-button v-if="orderFormDisabled && form.id" type="primary" @click="handleEdit">编 辑</el-button>
            </div>
            <div>
              <el-button v-if="!orderFormDisabled" type="primary" @click="submitForm">确 定</el-button>
              <el-button v-if="!orderFormDisabled" @click="cancel">取 消</el-button>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="订单产品">
          <el-card v-if=!open >
            <h4>提示</h4>
            <ul>
              <li>若添加订单，请先点击 新增 按钮。</li>
              <li>若查看订单，请先点击 订单列表 中订单编号进行查看。</li>
            </ul>
            <el-divider />
          </el-card>
          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5" v-if="orderFormDisabled && form.id">
              <el-button type="primary" icon="Edit" @click="handleEdit">编 辑</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button v-if="!orderFormDisabled" type="danger" icon="Delete" @click="handleDeleteScmCustomerOrderItems">删除</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button v-if="!orderFormDisabled" type="primary" @click="submitForm">保 存</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button v-if="!orderFormDisabled" @click="cancel">取 消</el-button>
            </el-col>
            <el-col :span="1.5"  v-if="form.id > 0">
              <el-button type="success" icon="Plus" @click="handlePullFromCustomerQuotes">报价单拉取</el-button>
            </el-col>
            <el-col :span="1.5" v-if="form.id > 0">
              <el-button type="warning" icon="Plus" @click="handleSelectFromCustomerQuotes">报价单中选择</el-button>
            </el-col>
            <el-col :span="1.5" v-if="form.id > 0">
              <el-button type="warning" icon="Plus" @click="handleSelectFromCustomerOrders">历史订单中选择</el-button>
            </el-col>
            <el-col :span="1.5" v-if="form.id > 0">
              <el-button type="info" icon="Right" @click="handleConvertToSupplierOrder">生成供应商订单</el-button>
            </el-col>
            <right-toolbar v-if="form.id > 0" v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"
                           :search="false" :linked-id="form.id" :attachment-type="11" :attachment-path="form.orderCode"></right-toolbar>
          </el-row>
          <el-form ref="scmCustomerOrdersItemsRef" :model="form" :rules="itemRules" label-width="80px" v-if=open :disabled="orderFormDisabled">
<!--            <el-row :gutter="10" class="mb8">-->
<!--              <el-col :span="1.5">-->
<!--                <el-button type="primary" icon="Plus" @click="handleAddScmCustomerOrderItems">添加</el-button>-->
<!--              </el-col>-->
<!--              <el-col :span="1.5">-->
<!--                <el-button type="danger" icon="Delete" @click="handleDeleteScmCustomerOrderItems">删除</el-button>-->
<!--              </el-col>-->
<!--              <el-col :span="1.5">-->
<!--                <el-button type="success" icon="Plus" @click="handlePullFromCustomerQuotes">报价单拉取</el-button>-->
<!--              </el-col>-->
<!--              <el-col :span="1.5">-->
<!--                <el-button type="warning" icon="Plus" @click="handleSelectFromCustomerQuotes">报价单中选择</el-button>-->
<!--              </el-col>-->
<!--              <el-col :span="1.5">-->
<!--                <el-button type="info" icon="Right" @click="handleConvertToSupplierOrder">生成供应商订单</el-button>-->
<!--              </el-col>-->
<!--            </el-row>-->
            <el-table :data="scmCustomerOrderItemsList" :row-class-name="rowScmCustomerOrderItemsIndex" @selection-change="handleScmCustomerOrderItemsSelectionChange" ref="scmCustomerOrderItems" lazy :scrollbar-always-on="true">
              <el-table-column type="selection" width="50" align="center" />
              <el-table-column label="序号" align="center" prop="index" width="50" fixed />
<!--              <el-table-column label="产品ID" prop="productId" width="150">-->
<!--                <template #default="scope"><el-input v-model="scope.row.productId" placeholder="请输入产品ID" /></template>-->
<!--              </el-table-column>-->
              <el-table-column label="图号" align="center" prop="scmProjectProducts.drawingNumber" fixed width="98"/>
              <el-table-column label="版本" align="center" prop="scmProjectProducts.version" fixed  />
              <el-table-column label="内版本" align="center" prop="scmProjectProducts.internalVersion" fixed />
              <el-table-column label="品名" align="center" prop="scmProjectProducts.productName" fixed  />
              <el-table-column label="材质" align="center" prop="scmProjectProducts.material"  />
              <el-table-column label="阻燃等级" align="center" prop="scmProjectProducts.inflamingRetardingLevel"  />
              <el-table-column label="规格" align="center" prop="scmProjectProducts.specification" />
              <el-table-column label="型号" align="center" prop="scmProjectProducts.model"  />
              <el-table-column label="颜色" align="center" prop="scmProjectProducts.color"  />

              <el-table-column label="采购类型" prop="purchaseCategory" width="150">
                <template #default="scope">
                  <el-select v-model="scope.row.purchaseCategory" placeholder="请选择采购类型">
                    <el-option v-for="dict in scm_purchase_category" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="部品类型" prop="demandType" width="150">
                <template #default="scope">
                  <el-select v-model="scope.row.demandType" placeholder="请选择部品类型">
                    <el-option v-for="dict in scm_demand_type" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="机种" prop="model" width="150">
                <template #default="scope">
                  <el-input v-model="scope.row.model" placeholder="请输入机种" />
                </template>
              </el-table-column>
<!--              <el-table-column label="出厂编号" prop="manufactureNumber" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.manufactureNumber" placeholder="请输入出厂编号" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="出厂子编号" prop="manufactureSubNumber" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.manufactureSubNumber" placeholder="请输入出厂子编号" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="图号、型号" prop="drawingNumberModel" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.drawingNumberModel" placeholder="请输入图号、型号" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="版本" prop="drawingVersion" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.drawingVersion" placeholder="请输入版本" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="品名" prop="productName" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.productName" placeholder="请输入品名" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="材质" prop="material" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.material" placeholder="请输入材质" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="尺寸" prop="size" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.size" placeholder="请输入尺寸" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="规格" prop="specification" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.specification" placeholder="请输入规格" />-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="颜色" prop="color" width="150">-->
<!--                <template #default="scope">-->
<!--                  <el-input v-model="scope.row.color" placeholder="请输入颜色" />-->
<!--                </template>-->
<!--              </el-table-column>-->
              <el-table-column label="单价类型" prop="unitPriceType" width="150">
                <template #default="scope">
                  <el-select v-model="scope.row.unitPriceType" placeholder="请选择单价类型">
                    <el-option v-for="dict in scm_purchase_category" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)" ></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="数量" align="center" prop="quantity" width="150">
                <template #default="scope">
                  <el-input-number v-model="scope.row.quantity" placeholder="请输入数量" :min="0" :controls="false" style="width: 100%;"
                                   @change="(value) => handleQuantityChange(value, scope.row)" />
                </template>
              </el-table-column>
              <el-table-column label="单价"  align="center" prop="unitPrice" width="150">
                <template #default="scope" >
                  <span style="margin-right: 4px;">¥</span>
                  <el-input-number v-model="scope.row.unitPrice" placeholder="请输入单价" :min="0" style="width: 90%;"
                            :controls="false" class="number-right" :precision="2" @change="(value) => handleUnitPriceChange(value, scope.row)">
                  </el-input-number>
                </template>
              </el-table-column>
              <el-table-column label="金额" align="center" prop="amount" width="150">
                <template #default="scope">
                  <span style="margin-right: 4px;">¥</span>
                  <el-input-number v-model="scope.row.amount" placeholder="请输入金额" :min="0" style="width: 90%;"
                            :controls="false" class="number-right" :precision="2" >
                  </el-input-number>
                </template>
              </el-table-column>
              <el-table-column label="模具费" align="center" prop="moldCost" width="150">
                <template #default="scope">
                  <span style="margin-right: 4px;">¥</span>
                  <el-input-number v-model="scope.row.moldCost" placeholder="请输入模具费" :min="0" style="width: 90%;" :controls="false" class="number-right" :precision="2" />
                </template>
              </el-table-column>
              <el-table-column label="工装费" align="center" prop="jigCost" width="150">
                <template #default="scope">
                  <span style="margin-right: 4px;">¥</span>
                  <el-input-number v-model="scope.row.jigCost" placeholder="请输入工装费" :min="0" style="width: 90%;" :controls="false" class="number-right" :precision="2" />
                </template>
              </el-table-column>
              <el-table-column label="币种" align="center" prop="customerCurrency" width="150">
                <template #default="scope">
                  <el-select v-model="scope.row.customerCurrency" placeholder="请选择客户币种">
                    <el-option
                      v-for="dict in scm_currency"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    ></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="汇率" align="center" prop="customerCurrencyRate" width="150">
                <template #default="scope">
                  <el-input-number v-model="scope.row.customerCurrencyRate" placeholder="请输入客户币种汇率" :min="0" style="width: 90%;" :controls="false" class="number-right" :precision="4" />
                </template>
              </el-table-column>
              <el-table-column label="订单到货日" align="center" prop="requestedDeliveryDate" width="240">
                <template #default="scope">
                  <el-date-picker clearable
                                  v-model="scope.row.requestedDeliveryDate"
                                  type="date"
                                  value-format="YYYY-MM-DD"
                                  placeholder="请选择订单到货日"
                                  style="width: 100%;">
                  </el-date-picker>
                </template>
              </el-table-column>
              <el-table-column label="到货日回复" align="center" prop="repliedDeliveryDate" width="240">
                <template #default="scope">
                  <el-date-picker clearable
                                  v-model="scope.row.repliedDeliveryDate"
                                  type="date"
                                  value-format="YYYY-MM-DD"
                                  placeholder="请选择到货日回复"
                                  style="width: 100%;">
                  </el-date-picker>
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </pane>
  </splitpanes>

  <!--从报价单中选择 -->
  <el-dialog title="从报价单中选择" v-model="openCustQuotes" width="1000px" append-to-body>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="Plus" :disabled="multiple" @click="addFromCustomerQuotes"
        >添加到订单</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button plain @click="cancelForCustomerQuotes"
        >取消</el-button>
      </el-col>

      <right-toolbar v-model:showSearch="showSearch" @queryTable="getListForCustomerQuotes" :search="false"></right-toolbar>
    </el-row>
    <el-table v-loading="loadingForCustomerQuotes" :data="scmCustomerQuotesList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="图号" align="center" prop="scmProjectProducts.drawingNumber" fixed width="98"/>
      <el-table-column label="版本" align="center" prop="scmProjectProducts.version" fixed width="50" v-if="columns[0].visible" />
      <el-table-column label="内版本" align="center" prop="scmProjectProducts.internalVersion" fixed width="65" v-if="columns[1].visible"  />
      <el-table-column label="品名" align="center" prop="scmProjectProducts.productName" fixed  v-if="columns[2].visible" />
      <el-table-column label="供应商名" align="center" prop="supplierName"  v-if="columns[3].visible" />
      <el-table-column label="报价日期" align="center" prop="quoteDate" width="99"  v-if="columns[4].visible" >
        <template #default="scope">
          <span>{{ parseTime(scope.row.quoteDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="绘图材质" align="center" prop="drawingMaterial"  v-if="columns[5].visible" />
      <el-table-column label="材质" align="center" prop="scmProjectProducts.material"  v-if="columns[6].visible" />
      <el-table-column label="阻燃等级" align="center" prop="scmProjectProducts.inflamingRetardingLevel"  v-if="columns[7].visible" />
      <el-table-column label="含税" align="center" prop="taxIncluded"  v-if="columns[8].visible" >
        <template #default="scope">
          <dict-tag :options="sys_yes_no" :value="scope.row.taxIncluded"/>
        </template>
      </el-table-column>
      <el-table-column label="含运费" align="center" prop="freightIncluded" v-if="columns[9].visible" >
        <template #default="scope">
          <dict-tag :options="sys_yes_no" :value="scope.row.freightIncluded"/>
        </template>
      </el-table-column>
      <el-table-column label="一次性" align="center"  v-if="columns[10].visible" >
        <el-table-column label="数量" align="center" prop="disposableQuantity" />
        <el-table-column label="单位" align="center" prop="disposableUnit" />
        <el-table-column label="单价" align="center" prop="disposableUnitPrice" />
      </el-table-column>
      <el-table-column label="试做" align="center"  v-if="columns[11].visible" >
        <el-table-column label="数量" align="center" prop="tryLot" />
        <el-table-column label="单位" align="center" prop="tryUnit" />
        <el-table-column label="单位单价" align="center" prop="tryUnitPrice" />
        <el-table-column label="总价" align="center" prop="tryTotalPrice" />
      </el-table-column>
      <el-table-column label="量产" align="center" v-if="columns[12].visible"  >
        <el-table-column label="数量" align="center" prop="massLot" />
        <el-table-column label="单位" align="center" prop="massUnit" />
        <el-table-column label="单价" align="center" prop="massUnitPrice" />
      </el-table-column>
      <el-table-column label="模具费" align="center" prop="moldCost"  v-if="columns[13].visible" />
      <el-table-column label="工装费" align="center" prop="jigCost"  v-if="columns[14].visible" />
      <el-table-column label="模具试做天数" align="center" prop="moldTryingDeliveryDays"  v-if="columns[15].visible" />
      <el-table-column label="模具使用寿命(次)" align="center" prop="moldLife"   />
      <el-table-column label="一次性交付天数" align="center" prop="disposableDeliveryDays"   />
      <el-table-column label="试做交付天数" align="center" prop="tryDeliveryDays"   />
      <el-table-column label="量产交付天数" align="center" prop="massDeliveryDays"  />
      <el-table-column label="状态" align="center" prop="status"  >
        <template #default="scope">
          <dict-tag :options="scm_select_satus" :value="scope.row.status"/>
        </template>
      </el-table-column>
      <el-table-column label="状态原因" align="center" prop="statusReason"  />
      <el-table-column label="沟通内容" align="center" prop="communicationContent" width="140"  />
    </el-table>
    <pagination
        v-show="totalForCustomerQuotes>0"
        :total="totalForCustomerQuotes"
        v-model:page="queryParamsForCustomerQuotes.pageNum"
        v-model:limit="queryParamsForCustomerQuotes.pageSize"
        @pagination="getListForCustomerQuotes"
    />
  </el-dialog>

  <!--从历史订单中选择 -->
  <el-dialog title="从历史订单中选择" v-model="openCustOrders" width="1100px" append-to-body>
    <el-form :model="queryParamsForCustomerOrderItemsOld" ref="queryRef2" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="订单编号" prop="orderCode">
        <el-input
            v-model="queryParamsForCustomerOrderItemsOld.orderCode"
            placeholder="请输入订单编号"
            clearable
            @keyup.enter="getListForCustomerOrderItemsOld"
        />
      </el-form-item>

      <el-form-item label="图号" prop="drawingNumber">
        <el-input
            v-model="queryParamsForCustomerOrderItemsOld.drawingNumber"
            placeholder="请输入图号"
            clearable
            @keyup.enter="getListForCustomerOrderItemsOld"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="getListForCustomerOrderItemsOld">搜索</el-button>
        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="Plus" :disabled="multiple" @click="addFromCustomerOrders"
        >添加到订单</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button plain @click="cancelForCustomerOrders"
        >取消</el-button>
      </el-col>

      <right-toolbar v-model:showSearch="showSearch" @queryTable="getListForCustomerOrderItemsOld" :search="false"></right-toolbar>
    </el-row>

    <el-table v-loading="loadingForCustomerOrderItemsOld" :data="scmCustomerOrderItemsListOld" @selection-change="handleSelectionChangeForCustomerOrderItemsOld">
      <el-table-column type="selection" width="50" align="center" />
      <el-table-column label="序号" align="center" prop="index" width="50" fixed />
<!--      <el-table-column label="" align="center" prop="itemId" />-->
<!--      <el-table-column label="订单ID" align="center" prop="orderId" />-->
<!--      <el-table-column label="产品ID" align="center" prop="productId" />-->
      <el-table-column label="订单编号" align="center" prop="orderCode" fixed width="170"/>
      <el-table-column label="图号" align="center" prop="scmProjectProducts.drawingNumber" fixed width="98"/>
      <el-table-column label="版本" align="center" prop="scmProjectProducts.version" fixed width="50" v-if="columns[0].visible" />
      <el-table-column label="内版本" align="center" prop="scmProjectProducts.internalVersion" fixed width="65" v-if="columns[1].visible"  />
      <el-table-column label="品名" align="center" prop="scmProjectProducts.productName" v-if="columns[2].visible" />
      <el-table-column label="材质" align="center" prop="scmProjectProducts.material" v-if="columns[3].visible" />
      <el-table-column label="阻燃等级" align="center" prop="scmProjectProducts.inflamingRetardingLevel" v-if="columns[3].visible" />
      <el-table-column label="规格" align="center" prop="scmProjectProducts.specification" v-if="columns[4].visible"/>
      <el-table-column label="型号" align="center" prop="scmProjectProducts.model" v-if="columns[4].visible"/>
      <el-table-column label="颜色" align="center" prop="scmProjectProducts.color" v-if="columns[5].visible"/>
      <el-table-column label="采购类型" align="center" prop="purchaseCategory" width="98" v-if="columns[9].visible">
        <template #default="scope">
          <dict-tag :options="scm_purchase_category" :value="scope.row.purchaseCategory"/>
        </template>
      </el-table-column>
      <el-table-column label="部品类型" align="center" prop="demandType" width="98" v-if="columns[10].visible">
        <template #default="scope">
          <dict-tag :options="scm_demand_type" :value="scope.row.demandType"/>
        </template>
      </el-table-column>
      <el-table-column label="机种" align="center" prop="model" />
<!--      <el-table-column label="出厂编号" align="center" prop="manufactureNumber" />-->
<!--      <el-table-column label="出厂子编号" align="center" prop="manufactureSubNumber" />-->
<!--      <el-table-column label="图号、型号" align="center" prop="drawingNumberModel" />-->
<!--      <el-table-column label="版本" align="center" prop="drawingVersion" />-->
<!--      <el-table-column label="品名" align="center" prop="productName" />-->
<!--      <el-table-column label="材质" align="center" prop="material" />-->
<!--      <el-table-column label="尺寸" align="center" prop="size" />-->
<!--      <el-table-column label="规格" align="center" prop="specification" />-->
<!--      <el-table-column label="颜色" align="center" prop="color" />-->
      <el-table-column label="单价类型" align="center" prop="unitPriceType" />
      <el-table-column label="单价" align="center" prop="unitPrice" />
      <el-table-column label="数量" align="center" prop="quantity" />
      <el-table-column label="金额" align="center" prop="amount" />
      <el-table-column label="模具费" align="center" prop="moldCost" />
      <el-table-column label="工装费" align="center" prop="jigCost" />
<!--      <el-table-column label="订单到货日" align="center" prop="requestedDeliveryDate" width="180">-->
<!--        <template #default="scope">-->
<!--          <span>{{ parseTime(scope.row.requestedDeliveryDate, '{y}-{m}-{d}') }}</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column label="到货日回复" align="center" prop="repliedDeliveryDate" width="180">-->
<!--        <template #default="scope">-->
<!--          <span>{{ parseTime(scope.row.repliedDeliveryDate, '{y}-{m}-{d}') }}</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column label="备注" align="center" prop="remarks" />-->
<!--      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
<!--        <template #default="scope">-->
<!--          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['scm:scmCustomerOrderItems:edit']">修改</el-button>-->
<!--          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['scm:scmCustomerOrderItems:remove']">删除</el-button>-->
<!--        </template>-->
<!--      </el-table-column>-->
    </el-table>

    <pagination
        v-show="totalForCustomerOrderItemsOld>0"
        :total="totalForCustomerOrderItemsOld"
        v-model:page="queryParamsForCustomerOrderItemsOld.pageNum"
        v-model:limit="queryParamsForCustomerOrderItemsOld.pageSize"
        @pagination="getListForCustomerOrderItemsOld"
    />
  </el-dialog>


</template>

<script setup>

import {Pane, Splitpanes} from "splitpanes";
import "splitpanes/dist/splitpanes.css"

// defineExpose({ getList });

const props = defineProps({
  modelValue: {
    type: String,
    required: true
  },
  projectId: {
    type: String,
    default: ''
  }
})

const emit = defineEmits(['update:modelValue']);

// const data = reactive({
//   form: {},
//   queryParams: {
//     projectId: props.projectId,
//   }
// });

import { listScmCustomerOrders, getScmCustomerOrders, delScmCustomerOrders, addScmCustomerOrders, updateScmCustomerOrders, initScmCustomerOrders } from "@/api/scm/scmCustomerOrders";
import useAppStore from "@/store/modules/app.js";
import {
  listScmCustomerOrderItems,
  pullScmCustomerOrderItems,
  addScmCustomerOrderItemsFromQuotes, addScmCustomerOrderItemsFromOrdersOld
} from "@/api/scm/scmCustomerOrderItems.js";
import {createScmSupplierOrders} from "@/api/scm/scmSupplierOrders.js";
import {listScmCustomerQuotes} from "@/api/scm/scmCustomerQuotes.js";
import DictTag from "@/components/DictTag/index.vue";

const { proxy } = getCurrentInstance();
const appStore2 = useAppStore()
const { scm_payment_status } = proxy.useDict('scm_payment_status');
const {
  scm_demand_type,
  scm_project_customer_status,
  scm_product_status,
  scm_project_supplier_status,
  scm_purchase_category,
  scm_currency
} = proxy.useDict(
    "scm_demand_type",
    "scm_project_customer_status",
    "scm_product_status",
    "scm_project_supplier_status",
    "scm_purchase_category",
    "scm_currency"
);


const scmCustomerOrdersList = ref([]);
const scmCustomerOrderItemsList = ref([]);
const open = ref(false);
const openCustQuotes = ref(false);
const openCustOrders = ref(false);
const orderFormDisabled = ref(true);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const checkedScmCustomerOrderItems = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    projectId: props.projectId,
    orderCode: null,
    orderDate: null,
    requestedDeliveryDate: null,
    repliedDeliveryDate: null,
    paymentStatus: null,
  },
  rules: {
    projectId: [
      { required: true, message: "项目ID不能为空", trigger: "blur" }
    ]
    // orderCode: [
    //   { required: true, message: "订单编号不能为空", trigger: "blur" }
    // ],
  },
  itemRules: {
  },
  queryParamsForCustomerOrderItemsOld : {
    pageNum: 1,
    pageSize: 11,
    projectId: null,
    productId: null,
    orderCode: null,
    drawingNumber: null
  },

});

const { queryParams, form, rules, itemRules,queryParamsForCustomerOrderItemsOld } = toRefs(data);

// const localProjectId = ref(props.projectId);
// 监听 projectId 变化
watch(
    () => props.projectId,
    (newVal) => {
      console.log('projectId changed to:', newVal);
      queryParams.value.projectId = newVal; // 更新本地变量
      getList();
    }
);

/** 查询客户订单列表 */
function getList() {
  loading.value = true;
  reset();
  listScmCustomerOrders(queryParams.value).then(response => {
    scmCustomerOrdersList.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}

// 添加编辑按钮处理方法
function handleEdit() {
  orderFormDisabled.value = false;
}
// 取消按钮
function cancel() {
  // open.value = false;
  // reset();
  orderFormDisabled.value = true; // 恢复表单禁用状态
  inquiryCurrentOrder(form.value.id);
}

// 表单重置
function reset() {
  form.value = {
    id: null,
    projectId: queryParams.value.projectId,
    orderCode: null,
    orderDate: null,
    requestedDeliveryDate: null,
    repliedDeliveryDate: null,
    totalAmount: null,
    receivedAmount: null,
    paymentStatus: null,
    buyerTitle: null,
    buyerAddress: null,
    buyerPerson: null,
    buyerPhone: null,
    buyerAccountBank: null,
    buyerAccountNumber: null,
    buyerSignDate: null,
    sellerTitle: null,
    sellerAddress: null,
    sellerPerson: null,
    sellerPhone: null,
    sellerAccountBank: null,
    sellerAccountNumber: null,
    sellerSignDate: null,
    contractFileName: null,
    contractFile: null,
    remarks: null,
    createBy: null,
    createTime: null,
    updateBy: null,
    updateTime: null
  };
  scmCustomerOrderItemsList.value = [];
  proxy.resetForm("scmCustomerOrdersRef");
  proxy.resetForm("scmCustomerOrderItemsRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.id);
  single.value = selection.length !== 1;
  multiple.value = !selection.length;
}

/** 新增按钮操作 */
function handleAdd() {
  reset();
  open.value = true;
  // 使用 nextTick 确保表单渲染完成后再提交
  nextTick(() => {
    submitForm();
  });

  // title.value = "添加客户订单";
}

/** 修改按钮操作 */
function handleUpdate(row) {
  reset();
  const _id = row.id || ids.value
  getScmCustomerOrders(_id).then(response => {
    form.value = response.data;
    scmCustomerOrderItemsList.value = response.data.scmCustomerOrderItemsList;
    open.value = true;
    title.value = "修改客户订单";
  });
}

/** 提交按钮 */
function submitForm() {
  console.log('submitForm:' + form.value.projectId);
    proxy.$refs["scmCustomerOrdersRef"].validate(valid => {
      console.log('submitForm validate result:', valid);
      if (valid) {
        form.value.scmCustomerOrderItemsList = scmCustomerOrderItemsList.value;
        form.value.contractFileName = form.value.contractFile ? form.value.contractFile.substring(form.value.contractFile.lastIndexOf('/') + 1) : '';
        if (form.value.id != null) {
          updateScmCustomerOrders(form.value).then(response => {
            proxy.$modal.msgSuccess("修改成功");
            open.value = true;
            orderFormDisabled.value = true; // 提交成功后恢复表单禁
            inquiryCurrentOrder(form.value.id);
            getList();
          });
        } else {
          addScmCustomerOrders(form.value).then(response => {
            proxy.$modal.msgSuccess("新增成功");
            open.value = true;
            orderFormDisabled.value = true; // 提交成功后恢复表单禁
            form.value = response.data;
            getList();
          });
        }
      }else {
        resolve(false); // 验证失败
      }
    });
}

/** 删除按钮操作 */
function handleDelete(row) {
  const _ids = row.id || ids.value;
  proxy.$modal.confirm('是否确认删除客户订单编号为"' + row.orderCode + '"的数据项？').then(function() {
    return delScmCustomerOrders(_ids);
  }).then(() => {
    open.value = false;
    reset();
    getList();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {});
}

/** 客户订单明细序号 */
function rowScmCustomerOrderItemsIndex({ row, rowIndex }) {
  row.index = rowIndex + 1;
}

/** 客户订单明细添加按钮操作 */
function handleAddScmCustomerOrderItems() {
  let obj = {};
  obj.productId = "";
  obj.purchaseCategory = "";
  obj.demandType = "";
  obj.model = "";
  obj.manufactureNumber = "";
  obj.manufactureSubNumber = "";
  obj.drawingNumberModel = "";
  obj.drawingVersion = "";
  obj.productName = "";
  obj.material = "";
  obj.size = "";
  obj.specification = "";
  obj.color = "";
  obj.unitPriceType = "";
  obj.unitPrice = "";
  obj.quantity = "";
  obj.amount = "";
  obj.moldCost = "";
  obj.jigCost = "";
  obj.requestedDeliveryDate = "";
  obj.repliedDeliveryDate = "";
  obj.remarks = "";
  scmCustomerOrderItemsList.value.push(obj);
}

/** 数量变化时自动计算金额 */
function handleQuantityChange(value, row) {
  if (row.unitPrice && value) {
    row.amount = (row.unitPrice * value).toFixed(2);
  } else {
    row.amount = 0;
  }
}
/** 单价变化时自动计算金额 */
function handleUnitPriceChange(value, row) {
  if (row.quantity && value) {
    row.amount = (row.quantity * value).toFixed(2);
  } else {
    row.amount = 0;
  }
}

/** 客户订单明细删除按钮操作 */
function handleDeleteScmCustomerOrderItems() {
  if (checkedScmCustomerOrderItems.value.length == 0) {
    proxy.$modal.msgError("请先选择要删除的客户订单明细数据");
  } else {
    const scmCustomerOrderItemss = scmCustomerOrderItemsList.value;
    const checkedScmCustomerOrderItemss = checkedScmCustomerOrderItems.value;
    scmCustomerOrderItemsList.value = scmCustomerOrderItemss.filter(function(item) {
      return checkedScmCustomerOrderItemss.indexOf(item.index) == -1
    });
  }
}

/** 复选框选中数据 */
function handleScmCustomerOrderItemsSelectionChange(selection) {
  checkedScmCustomerOrderItems.value = selection.map(item => item.index)
}

/** 导出按钮操作 */
function handleExport() {
  proxy.download('scm/scmCustomerOrders/export', {
    ...queryParams.value
  }, `scmCustomerOrders_${new Date().getTime()}.xlsx`)
}

getList();

function handlePullFromCustomerQuotes(){
  console.log('handlePullFromCustomerQuotes' + queryParams.value.projectId + ' : ' + form.value.id );
  pullScmCustomerOrderItems(form.value).then(response => {
    inquiryCurrentOrder(form.value.id);
    proxy.$modal.msgSuccess("初始化成功");
  })
}


/** 展示用户详情 */
function handleCurrentOrder(val){
  if (!val) return;
  open.value = true;
  form.value = val;
  orderFormDisabled.value = true; // 设置表单为禁用状态

  const _id = val.id
  inquiryCurrentOrder(_id);
  // getScmCustomerOrders(_id).then(response => {
  //   form.value = response.data;
  //   scmCustomerOrderItemsList.value = response.data.scmCustomerOrderItemsList;
  // });
}

/** 展示用户详情 */
function inquiryCurrentOrder(id){
  if (!id) return;
  getScmCustomerOrders(id).then(response => {
    form.value = response.data;
    scmCustomerOrderItemsList.value = response.data.scmCustomerOrderItemsList;
  });
}

/** 生成供应商订单 */
function handleConvertToSupplierOrder(){
  console.log('handleConvertToSupplierOrder' + queryParams.value.projectId + ' : ' + form.value.id );
  createScmSupplierOrders(form.value).then(response => {
    // inquiryCurrentOrder(form.value.id);
    proxy.$modal.msgSuccess("转化成功");
  })

  // 通过 emit 触发父组件更新
  emit('update:modelValue', "ninth");
}

// 点击“确认询价”按钮触发
const handleInitCustOrder = () => {
  initScmCustomerOrders(queryParams.value.projectId).then(response => {
    proxy.$modal.msgSuccess("初始化成功");
  });
}

/** 从客户报价单中选取 */
function handleSelectFromCustomerQuotes(){
  openCustQuotes.value = true;
  getListForCustomerQuotes();
  // const _ids = row.id || ids.value;
  // const _ids =  ids.value;
  // console.log('handleSelectFromCustomerQuotes' + queryParams.value.projectId + ' : ' + form.value.id + ' : ' + _ids);
  // addScmCustomerOrderItemsFromQuotes(form.value, _ids).then(response => {
  //   proxy.$modal.msgSuccess("选择成功");
  // })
}

/** 查询客户报价单列表 */
const queryParamsForCustomerQuotes = computed(() => ({
  pageNum: 1,
  pageSize: 10,
  projectId: queryParams.value.projectId
}));
const scmCustomerQuotesList = ref([]);
const totalForCustomerQuotes = ref(0);
const loadingForCustomerQuotes = ref(false);
function getListForCustomerQuotes() {
  loadingForCustomerQuotes.value = true;
  listScmCustomerQuotes(queryParamsForCustomerQuotes.value).then(response => {
    scmCustomerQuotesList.value = response.rows;
    totalForCustomerQuotes.value = response.total;
    loadingForCustomerQuotes.value = false;
  });
}
/** 从询价单添加 按钮操作 */
function addFromCustomerQuotes(row) {
  const _ids = row.id || ids.value;
  addScmCustomerOrderItemsFromQuotes(form.value, _ids).then(response => {
    proxy.$modal.msgSuccess("添加到订单成功");
    inquiryCurrentOrder(form.value.id)
    openCustQuotes.value = false;
  })

}
/**取消按钮 */
function cancelForCustomerQuotes() {
  openCustQuotes.value = false;
}

/** 从客户订单中选择 */
function handleSelectFromCustomerOrders(){

  openCustOrders.value = true;
  // getListForCustomerOrderItemsOld();
  // console.log('handleSelectFromCustomerOrders' + queryParams.value.projectId + ' : ' + form.value.id );
}

/** 查询客户订单item列表 */
// const customerOrderItemsData = reactive( {
//   queryParamsForCustomerOrderItemsOld : {
//     pageNum: 1,
//     pageSize: 11,
//     projectId: null,
//     productId: null,
//     orderCode: null,
//     drawingNumber: null
//   }
// });
// const queryParamsForCustomerOrderItemsOld = toRefs(customerOrderItemsData);
const scmCustomerOrderItemsListOld = ref([]);
const totalForCustomerOrderItemsOld = ref(0);
const loadingForCustomerOrderItemsOld = ref(false);
function getListForCustomerOrderItemsOld() {
  if ((!queryParamsForCustomerOrderItemsOld.value.orderCode || queryParamsForCustomerOrderItemsOld.value.orderCode.trim() === '') &&
      (!queryParamsForCustomerOrderItemsOld.value.drawingNumber || queryParamsForCustomerOrderItemsOld.value.drawingNumber.trim() === '')) {
    proxy.$modal.msgError("请输入 订单号 或者  图号");
    return;
  }
  loadingForCustomerOrderItemsOld.value = true;
  listScmCustomerOrderItems(queryParamsForCustomerOrderItemsOld.value).then(response => {
    if (!response.rows || response.rows.length === 0){
      proxy.$modal.msgError("没有查询到数据");
    }
    scmCustomerOrderItemsListOld.value = response.rows;
    totalForCustomerOrderItemsOld.value = response.total;
    loadingForCustomerOrderItemsOld.value = false;
  });
}
/** 添加到订单 按钮操作 */
function addFromCustomerOrders(row) {
  const _ids = row.id || ids.value;
  console.log('addFromCustomerOrders' + queryParams.value.projectId + ' : ' + form.value.id + ' : ' + _ids)
  addScmCustomerOrderItemsFromOrdersOld(form.value, _ids).then(response => {
    proxy.$modal.msgSuccess("添加到订单成功");
    inquiryCurrentOrder(form.value.id)
    openCustOrders.value = false;
  })

}
/**取消按钮 */
function cancelForCustomerOrders() {
  openCustOrders.value = false;
}
// 多选框选中数据
// 添加一个新的引用变量用于存储历史订单项的选中状态
// const idsForCustomerOrderItemsOld = ref([]);
function handleSelectionChangeForCustomerOrderItemsOld(selection) {
  // ids.value = selection.map(item => item.id);
  ids.value = selection.map(item => item.itemId);
  single.value = selection.length !== 1;
  multiple.value = !selection.length;
}


// 列显隐信息
const columns = ref([
  { key: 0, label: `版本`, visible: true },
  { key: 1, label: `内版本`, visible: true },
  { key: 2, label: `品名`, visible: true },
  { key: 3, label: `材质`, visible: true },
  { key: 4, label: `规格`, visible: true },
  { key: 5, label: `颜色`, visible: true },
  { key: 6, label: `单台 用量`, visible: true },
  { key: 7, label: `月度 用量`, visible: true },
  { key: 8, label: `年度 用量`, visible: true },
  { key: 9, label: `一次性`, visible: true },
  { key: 10, label: `一次性试做`, visible: true },
  { key: 11, label: `试做`, visible: true },
  { key: 12, label: `量产`, visible: true },
  { key: 13, label: `希望报价日`, visible: true },
  { key: 14, label: `希望到货日`, visible: true },
  { key: 15, label: `需求资料`, visible: true },
  { key: 16, label: `备注`, visible: true }
]);

</script>

<style scoped>
.min-height {
  min-height: 300px !important;
}

.custom-divider {
  margin-top: 0px !important;    /* 调整上方距离 */
  margin-bottom: 15px !important;  /* 调整下方距离 */
}

/* 使用深度选择器确保 el-input-number 内容靠右对齐 */
:deep(.number-right .el-input__inner) {
  text-align: right !important;
}

/* 所有 el-input-number 内容靠右对齐 */
:deep(.el-input-number .el-input__inner) {
  width: 100%;
}
</style>